<template>
    <div class="e-form">
        <BillTop @cancel="handleClose"></BillTop>
        <div class="tabs">
            <div class="tabs-title">基本信息</div>
            <div style="width: 100%" class="form">
                <!-- 基本信息 -->

                <el-form
                    ref="formDataRef"
                    :model="formData"
                    label-width="150px"
                    :rules="formDataRules"
                >
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="单据机构：">
                                <span>{{ formData.orgName }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="是否计加工费：" prop='isIncludingProcessingFee'>
                                <el-radio-group
                                    v-model="formData.isIncludingProcessingFee"
                                    :disabled="isRedSingle"
                                >
                                    <el-radio :label="1">是(外部加工)</el-radio>
                                    <el-radio :label="0">否(自行加工)</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="状态：">
                                <span>草稿</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="收料类型：" prop='receivingType'>
                                <el-radio-group
                                    v-model="formData.receivingType"
                                    :disabled="isRedSingle"
                                >
                                    <el-radio :label="0">普通加工</el-radio>
                                    <el-radio :label="1">砼加工</el-radio>
                                </el-radio-group>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <!-- 返回id、名字 -->
                            <el-form-item label="结算日期：">
                                <el-date-picker
                                    v-model="formData.settlementDate"
                                    type="date"
                                    placeholder="选择日期"
                                    :clearable="false"
                                    value-format="yyyy-MM-dd"
                                    v-if="!isRedSingle"
                                >
                                </el-date-picker>
                                <span v-else>{{
                                    formData.settlementDate
                                }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="录入人员：">
                                <!-- <span>{{formData.freight}}</span> -->
                                <span>{{ formData.entryPersonnelName }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="发票编号：" prop="invoiceNo">
                                <el-input
                                    placeholder="请填写发票编号"
                                    v-model="formData.invoiceNo"
                                    v-if="!isRedSingle"
                                    v-enterInteger1
                                ></el-input>
                                <span v-else>{{ formData.invoiceNo }}</span>
                            </el-form-item>
                        </el-col>
                    </el-row>

                    <!-- <el-row>
                                            <el-col :span="12">
                                                <el-form-item label="终期结算：">
                                                    <el-checkbox v-model="formData.isFinalSettlement"
                                                    ></el-checkbox>
                                                </el-form-item>
                                            </el-col>
                                        </el-row> -->

                    <!-- <el-row>
                                            <el-col :span="12">
                                                <el-form-item label="传财务共享">
                                                    <el-checkbox v-model="formData.wu"></el-checkbox>
                                                </el-form-item>
                                            </el-col>
                                        </el-row> -->

                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="备注：">
                                <el-input
                                    type="textarea"
                                    :rows="2"
                                    laceholder="请输入内容"
                                    v-model="formData.remarks"
                                    maxlength="500"
                                ></el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>
        <div class="buttons">
            <div>
                <el-button
                    type="primary"
                    style="background: #2e61d7"
                    @click="onsavexb"
                    >保存</el-button
                >
                <el-button
                    type="primary"
                    style="background: #2e61d7"
                    @click="handleClose"
                    >取消</el-button
                >
            </div>
        </div>
    </div>
</template>

<script>
import '@/utils/jquery.scrollTo.min'
import auditRequest from '@/api/materialSettlement/machiningment.js'
import { formatDate, showLoading, hideLoading } from '@/utils/common'
export default {
    data () {
        return {
            formData: {
                billNo: '', //	结算编号
                orgName: '', //机构name
                orgId: '', //机构id 不显示
                isIncludingProcessingFee: 1, //是否计加工费
                contractName: '', //合同名称
                contractBillId: '', //合同id
                contractBillNo: '', //合同编号
                processingUnitName: '', //加工单位名称
                processingUnitId: '', //加工单位 id
                materialSource: '', //原材料来源
                receivingType: 0, //收料类型 0 普通 1砼加工
                settlementDate: formatDate(new Date(), 'yyyy-MM-dd'), //结算日期
                processCost: 0, //加工费
                entryPersonnelName: '', //录入人员名称
                entryPersonnelId: '', //录入人员 id
                taxRate: 0, //税率
                totalAmount: 0, //税价合计
                taxAmount: 0, //税额
                cumulativeSettlementAmount: 0, //累计结算金额
                invoiceNo: '', //发票编号
                taxDifference: 0, //税额差额
                freight: 0, //运输单位费用(含税,元)
                isEndSettle: 0, //是否为终期结算 需要转成数字
                offsetAdvancePayment: 0, //冲预付款金额
                currency: '', //币种名称
                currencyId: '', //币种id
                state: '0', //状态
                baseCurName: '', //本位币名称
                baseCurId: '', //本位币id
                baseCurRate: 0, //本位币汇率
                baseCurAmount: 0, //结算金额 本位币
                remarks: '', //备注
                acceptanceBillId: '',
                acceptanceBillNo: '',
                baseCurFreight: 0,
                baseCurProcessCost: 0,
                baseCurTaxAmount: 0,
                baseCurTotalAmount: 0,
                billId: '',
                easId: '',
                evaluationLevel: '',
                founderId: '',
                founderName: '',
                gmtCreate: '',
                gmtModified: '',
                isOffsetAdvancePayment: 0,
                isRed: 0,
                nullifyCreated: '',
                nullifyCreator: '',
                nullifyCreatorId: '',
                nullifyDescription: '',
                nullifyReason: '',
                redBillState: null,
                rmbFreight: 0,
                rmbId: '',
                rmbName: '',
                rmbProcessCost: 0,
                rmbRate: 0,
                rmbTaxAmount: 0,
                rmbTotalAmount: 0,
                sourceId: '',
                sourceNumber: '',
                workId: ''
            },
            formDataRules: {
                isIncludingProcessingFee: [
                    {
                        required: true,
                        message: '请选择是否计加工费',
                        trigger: 'blur'
                    }
                ],
                receivingType: [
                    {
                        required: true,
                        message: '请选择收料类型',
                        trigger: 'blur'
                    }
                ],
                invoiceNo: [
                    {
                        required: true,
                        message: '请填写发票编号',
                        trigger: 'blur'
                    }
                ]
            }
        }
    },

    created () {
        this.user = JSON.parse(localStorage.getItem('vuex'))
        this.$set(
            this.formData,
            'entryPersonnelName',
            this.user.userInfo.userName
        )
        this.$set(this.formData, 'entryPersonnelId', this.user.userInfo.userId)
        this.$set(this.formData, 'orgName', this.user.userInfo.orgInfo.orgName)
        this.$set(this.formData, 'orgId', this.user.userInfo.orgInfo.orgId)
        if (this.$route.query.isRedSingle === '1') {
            this.getRedList()
            this.isRedSingle = true
        } else {
            this.isRedSingle = false
        }
    },
    methods: {
        async getRedList () {
            showLoading()
            try {
                let data = await auditRequest.redSingle(
                    this.$route.query.billid
                )
                this.formData = data
            } finally {
                hideLoading()
            }
        },

        //保存
        onsavexb () {
            this.$refs.formDataRef.validate(async valid => {
                if (!valid) return false
                const data = await auditRequest.addjgrk(this.formData)
                this.clientPop(
                    'info',
                    '保存成功!是否进行下一步操作？',
                    () => {
                        this.$router.replace({
                            path: '/machiningmentEdit',
                            query: {
                                billid: data,
                                was: 'see',
                                billtype: '1022'
                            }
                        })
                    },
                    null,
                    this.handleClose
                )
            })
        },
        handleClose () {
            this.$router.replace('/machiningmentList')
            console.log(12)
        }
    }
}
</script>

<style lang="scss" scoped>
.lll {
    width: 100%;
    height: 30px;
    line-height: 30px;
    background: #f2f2f2;
    padding-right: 20px;
    padding-left: 20px;
}
.buttons {
    left: 0;
}
.e-form {
    margin-bottom: 80px;
    padding: 0 20px;
    .tabs-title::before {
        content: '';
        height: 22px;
        width: 8px;
        border-radius: 40px;
        background-color: #2e61d7;
        display: block;
        position: absolute;
        left: 20px;
        margin-right: 20px;
    }
}

.e-table {
    background: #fff;
}
::v-deep.el-table .warning-row {
    display: none;
}
// ::v-deep.el-table__body-wrapper::-webkit-scrollbar{
//      width: 6px !important; // 横向滚动条
//     height: 10px !important// 纵向滚动条
// }

::v-deep .el-table__body-wrapper::-webkit-scrollbar {
    width: 6px; // 横向滚动条
    height: 10px; // 纵向滚动条
}
// 滚动条的滑块
::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
    background-color: #ddd;
    border-radius: 5px;
}
::v-deep.el-table .warning-row {
    display: none;
}
.el-tab-pane {
    margin-left: -10px;
}
.childTab {
    ::v-deep .el-tabs__header {
        position: absolute !important;
    }
    ::v-deep .el-tabs__content {
        padding: 0 0 0 20px !important;
    }
}
.childTab1 {
    ::v-deep .el-tabs__header {
        position: absolute !important;
        .el-tabs__nav-scroll {
            position: relative;
            .el-tabs__nav {
                position: fixed;
                top: 0;
                width: 190px;
            }
        }
    }
}
.childTab2 {
    ::v-deep .el-tabs__header {
        position: absolute !important;
        .el-tabs__nav-scroll {
            position: relative;
            .el-tabs__nav {
                position: absolute;
                bottom: 0;
                width: 100%;
            }
        }
    }
}
</style>
